<!DOCTYPE HTML>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport"
		content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,aItemress=no">
	<title>我的会员</title>
	<link rel="stylesheet" type="text/css" href="../../css/base.css" />
	<style type="text/css">
		body {
			background: #F0F1F2;
		}

		.my-members {
			width: 100%;
			background: rgba(0, 90, 147, 1);
			padding: 0.25rem 0.15rem;
			box-sizing: border-box;
		}

		.my-members .title {
			font-size: 0.15rem;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: rgba(255, 255, 255, 1);
			line-height: 0.21rem;
		}

		.cont-wraper {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.cont-wraper .money {
			font-size: 0.4rem;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			line-height: 0.56rem;
		}

		.cont-wraper .right {
			display: flex;
			align-items: center;
		}

		.level {
			font-size: 0.13rem;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: rgba(255, 255, 255, 1);
			line-height: 0.18rem;
			margin-right: 0.05rem;
		}

		.icon {
			width: 0.12rem;
			height: 0.12rem;
			color: rgba(255, 255, 255, 1);
			border: 1px solid rgba(255, 255, 255, 1);
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.transaction-records {
			/* border-radius: 0.04rem 0.04rem 0px 0px; */
			margin-top: -0.05rem;
			position: relative;
			/* z-index: 1000; */
			background: #ffffff;
		}

		.transaction-records .title {
			font-size: 0.15rem;
			font-weight: 500;
			color: rgba(46, 46, 46, 1);
			line-height: 0.15rem;
			padding: 0.17rem 0.12rem;
			box-sizing: border-box;
			display: flex;
			align-items: center;
		}

		.transaction-records .title .left-icon {
			width: 0.03rem;
			height: 0.15rem;
			background: linear-gradient(360deg, rgba(167, 233, 255, 1) 0%, rgba(0, 90, 147, 1) 100%);
			margin-right: 0.08rem;
		}

		.transaction-records .wraper {
			padding: 0 0.15rem;
		}

		.transaction-records .wraper .item {
			border-bottom: 1px solid #eeeeee;
			padding: 0.1rem 0;
		}

		.transaction-records .wraper .item .bottom {
			font-size: 0.12rem;
			font-weight: 400;
			color: rgba(153, 153, 153, 1);
			line-height: 0.17rem;
		}

		.transaction-records .wraper .item .top {
			display: flex;
			margin-bottom: 0.02rem;
			justify-content: space-between;
		}

		.transaction-records .wraper .item .top .left-title {
			font-size: 0.15rem;
			font-weight: 400;
			color: rgba(34, 34, 34, 1);
			line-height: 0.21rem;
		}

		.transaction-records .wraper .item .top .right-money {
			font-size: 0.15rem;
			font-weight: 500;
			color: rgba(34, 34, 34, 1);
			line-height: 0.21rem;
		}

		.topBox {
			/* border: 1px solid black; */
			width: 100%;
			height: 2.4rem;
			background: white;
			padding-top: 0.1rem;
			padding-left: 0.13rem;
			padding-right: 0.13rem;
			/* padding-bottom: 0.28rem; */
			/* margin-bottom: 0.28rem; */
		}

		.topImg {
			width: 100%;
			/* border: 1px solid black; */
			height: 1.8rem;
			background-image: url('../../image/membersImg.png');
			background-repeat: no-repeat;
			background-size: 100% 100%;
			position: relative;
		}

		.topImg img {
			display: block;
			width: auto;
			height: 100%;
		}

		.topTit {
			font-size: 0.16rem;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 0.36rem;
			position: absolute;
			top: 0.44rem;
			left: 0.48rem;
			/* margin-top: 0.84rem;
			margin-left: 0.68rem; */
		}

		.myMoney {
			font-size: 0.50rem;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 1rem;
			position: absolute;
			top: 0.64rem;
			left: 0.48rem;

		}
	</style>
</head>

<body>
	<div id="app" v-cloak="">
		<div class="data-statistics">
			<!-- 当前虚拟币 -->
			<!-- <div class="my-members">
				<div class="title">当前虚拟币{{is_agent}}</div>
				<div class="cont-wraper">
					<div class="money" v-text="money"></div>
					<div class="right" v-on:click="open_win_page('会员规则')">
						<div class="level" v-if="is_agent=='1'">代理商会员</div>
						<div class="level" v-else >{{level_name}}</div>
						<div class="icon">!</div>
					</div>
				</div>
			</div> -->
			<!-- <div class="topBox">
				<div class="topImg">
					<div class="topTit">我的资金</div>
					<div class="myMoney">{{money}}</div>
				</div>
			</div> -->
			<div class="my-members">
				<div class="title">我的资金</div>
				<div class="cont-wraper">
					<div class="money" v-text="money"></div>
					<!-- open_win_page('会员规则') -->
					<div class="right" onclick="is_login('my_brokerage','my_brokerage.html',false)">
						<div class="level">我的佣金</div>
					</div>
				</div>
				<!-- <div class="desc">{{remark}}</div> -->
			</div>
			<!-- 交明细记录 -->
			<div class="transaction-records">
				<div class="title">
					<div class="left-icon"></div>
					<div class="right-cont">交易记录</div>
				</div>
				<div class="wraper">

					<div class="item" v-for="(vo,index) in moneyList" :key="index">
						<div class="top">
							<div class="left-title" v-text="vo.remark"></div>
							<div class="right-money" v-text="vo.flag + vo.money"></div>
						</div>
						<div class="bottom" v-text="vo.add_time"></div>
					</div>

				</div>
			</div>
			<!-- 缺省页面 -->
			<div class="aui-text-center" v-if="moneyList.length < 1" style="margin-top: 1.04rem;" tapmode>
				<img src="../../image/bg/bg-nonecar.png"
					style="width:1.51rem;margin-left:50%;transform:translateX(-50%);" />
				<div
					style="font-size:0.14rem;font-family:PingFangSC-Regular;font-weight:400;color:#B3B3B3;margin-top:0.27rem;width:100%; text-align: center;">
					暂无数据
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/aui-dialog.js"></script>
<script>


	var vm = new Vue({
		el: "#app",
		data: {
			moneyList: [],
			level_name: '注册会员',
			money: 0,
			page: 1,
			loadmore: true,
			is_agent: 0
		},
		methods: {
			get_list: function () {
				get_data('api/User/balanceList', {
					token: $api.getStorage('token'),
					page: vm.page
				}, function (ret) {
					if (ret.status) {
						vm.money = ret.data.money
						vm.level_name = ret.data.level_name
						if (ret.data.list.length < 20) {
							vm.loadmore = false
						}
						ret.data.list.forEach(function (el) {
							vm.moneyList.push(el)
						})
					}
				})
			}
		}
	})
	apiready = function () {
		vm.is_agent = api.pageParam.is_agent
		vm.get_list()
		fnInitPullRefresh(function (ret) {
			vm.page = 1
			vm.loadmore = true
			vm.moneyList = []
			vm.level_name = '注册会员'
			vm.money = 0
			vm.get_list()
		})
		fnInitScrollToBottom(function (ret) {
			if (vm.loadmore) {
				vm.page++;
				vm.get_list()
			}
		})
	}
	function is_login(name, url, status) {
		if (vm.nickname == '请登录') {
			openWin_login();
			return;
		} else {
			open_win(name, url, status)
		}
	}

	// var vm = new Vue({
	// 	el: "#app",
	// 	data: {
	// 		moneyList: [],
	// 		money: "",
	// 		level_name: "",
	// 		is_agent:0,
	// 		limit:10,
	// 		page:1,
	// 		arr:[],
	// 		index:1
	// 	},
	//
	// 	methods: {
	// 		get_info: function() {
	// 			get_data('api/User/balanceList', {
	// 				token: $api.getStorage('token'),
	// 				page:vm.page,
	// 				limit:5
	// 			}, function(ret) {
	// 				// alert(JSON.stringify(ret))
	// 				// console.log(JSON.stringify(ret));
	// 				if (ret.status) {
	// 					vm.moneyList = ret.data.list;
	// 					vm.money = ret.data.money;
	// 					vm.level_name = ret.data.level_name;
	// 					vm.is_agent=ret.data.is_agent
	//
	// 				}
	// 			})
	// 		},
	//
	// 		get_list:function(){
	// 			get_data('api/User/balanceList', {
	// 				token: $api.getStorage('token'),
	// 				page:vm.page,
	// 				limit:5
	// 			}, function(ret) {
	// 				// alert(JSON.stringify(ret))
	// 				// console.log(JSON.stringify(ret));
	// 				if (ret.status) {
	// 					vm.arr = ret.data.list;
	// 					vm.money = ret.data.money;
	// 					vm.level_name = ret.data.level_name;
	// 					vm.is_agent=ret.data.is_agent
	// 					var list = vm.arr
	// 					if(list.length > 0){
	// 						for(var i = 0;i<list.length;i++){
	// 							console.log(list[i]);
	// 							vm.moneyList.push(list[i])
	// 						}
	// 					}else{
	// 						vm.index = 0;
	// 					}
	// 				}
	// 			})
	// 		}
	//
	//
	// 	}
	// })
	//
	// apiready = function() {
	// 	vm.get_info();
	// 	api.addEventListener({
  //       　　name:'scrolltobottom',
  //           extra:{threshold:0}
  //       }, function(ret, err){
	// 				AJ(ret)
	// 		// if(vm.index == 1){
	// 			var page = vm.page+1
	// 			vm.page = page;
	// 			console.log(vm.page);
	//
	// 　　　　　　//上拉加载时需要加载的数据
	// 			vm.get_list();
	// 		// }
	//
  //      });
	//
	// 	// vm.is_agent=$api.getStorage('is_agent')
	// 	vm.is_agent=api.pageParam.is_agent
	//
	// };
</script>

</html>